<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="sf" uri="http://www.springframework.org/tags/form" %>
<%-- <c:url value="/images/dl1.png" var="dl1img"/>
<c:url value="/images/dl2.png" var="dl2img"/>

<div class="investment" id="setting" style="height: 440px; width:1100px; margin-top:45px;">
<h2 class="sxtj" style="margin-left:20px;"><b>用户登录</b></h2>
	<form:form servletRelativeAction="/auth/doLogin" method="post" cssClass="cmxform" modelAttribute="loginForm">
		<ul class="choice subform" style="height:300px;">
	    <li style="height: 60px;">
	    	<form:input path="username" placeholder="用户名" title="请输入您的用户名" cssClass="required form-control" autocomplete="off"/>
	    	<form:errors path="username"/>
	    </li>
	    <li style="height: 60px;">
	    <form:password path="password" placeholder="密码" title="请输入您的密码" cssClass="required form-control" autocomplete="off"/>
	    <form:errors path="password"/>
	    </li>
	    <li><input type="submit" id="btnSubmit" class="submit btn" value="立刻登录"></li>
	    <li class="xc"><a href="#" onclick="dialogPassword();">忘记密码?</a><a href="<c:url value="/auth/register"/>">注册新账号</a></li>
	    <!--<li class="xc">
	    	<a href="/oauth/sain.html"><img alt="微博登录" src="/assets/fnp2p/images/wb.png" width="90" height="36"></a>
	    	<a href="/oauth/qq.html"><img alt="QQ登录" src="/assets/fnp2p/images/qq.png" width="90" height="36"></a>
	    </li>-->
	  </ul>
	</form:form>
</div>
<div id="dialog-form" title="找回密码">
	<form:form id="emailPasswordForm">
		<div style="padding-top: 10px;">
		<label>邮箱:</label>
		<input type="email" id="emailInput" name="email" class="form-control" style="background-color: #f2f2f2;" placeholder="Sample@Sample.com">
		</div>
		<div id="tipMessage" style="padding-top:10px;color: red;">
		</div>
		<div>
			<p>请输入您在#NAME#邮件，我们会向您的邮箱发送一个重置密码的链接</p>
			<p>请您按邮件中提示重置密码。</p>
		</div>
	</form:form>
</div>
<div id="dialog-message" title="提示">
	<div>
		<h3 >忘记密码已经邮件发送，请注意您的邮件</h3>
	</div>
</div>
<script type="text/javascript">
	var dialog;

	var dialogMessage;
	
	$(document).ready(function(){
		dialog = $("#dialog-form").dialog({
			autoOpen:false,
			width:400,
			buttons:{
				"确认":function(){
					$.ajax({
						url:"<c:url value="/auth/forgot"/>",
						method:"POST",
						data:$("#emailPasswordForm").serializeArray(),
						success:function(result){
							if(result.status == 0){
								dialog.dialog("close");	
							}else{
								$("#tipMessage").html(result.message);
							}
                            
						}
					});
				}
			}
		});

		dialogMessage = $("#dialog-message").dialog({
			autoOpen:false
		});
	});
	function dialogPassword()
	{
		dialog.dialog("open");
	}
</script> --%>
<div class="container">
	<div class="panel panel-default">
		<div class="panel-body">
			<div class="row">
				<div class="col-md-6"></div>
				<div class="col-md-6">
					<sf:form modelAttribute="loginForm" servletRelativeAction="/auth/doLogin">
					<c:if test="${not empty SPRING_SECURITY_LAST_EXCEPTION.message}">
					<div class="alert alert-danger">
						${SPRING_SECURITY_LAST_EXCEPTION.message }
					</div>
					</c:if>
						<div class="form-group">
							<div class="input-group">
								<span class="input-group-addon"><i class="fa fa-user"></i></span>
								<sf:input path="username" cssClass="form-control" placeholder="用户名"/>
							</div>
						</div>
						<div class="form-group">
							<div class="input-group">
								<span class="input-group-addon"><i class="fa fa-key"></i></span>
								<sf:password path="password" cssClass="form-control" placeholder="密码"/>
							</div>
						</div>
						<div class="form-group">
							<button type="submit" id="loginButton" class="btn btn-primary btn-block">登录</button>
						</div>
					</sf:form>
					<div>
						<ul>
							<li><a href="#">忘记密码?</a></li>
							<li><a href="#">注册新账号</a></li>
						</ul>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
